<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui">
	
	<!-- métodos rodados ao carregar página -->
	<f:event listener="#{usuarioBean.listarUsuario}" type="preRenderView" />

<h:head>
	<style>
.posicao_botao {
	width: 51%;
}

.botao {
	margin-top: 5px;
	margin-left: 5px;
}

.tableConsulta tr:nth-child(even) {
	background-color: #cacaca;
}

.tableConsulta {
	border: 1px solid #cacaca;
	border-collapse: collapse;
	border-spacing: 0;
}
</style>

	<style>
.ui-layout-north {
	z-index: 20 !important;
	overflow: visible !important;
}

.ui-layout-north .ui-layout-unit-content {
	overflow: visible !important;
}
</style>

	<script>
function relatorioClientela(){
	window.location.href="RelatorioClientelaForm.jsf";
}

function relatorioCliente(){
	window.location.href="RelatorioCliente.jsf";
}
</script>

</h:head>
<body bgcolor="#E8E8E8">



	<p:growl id="messages" />

	<p:layout fullPage="true">

		<p:layoutUnit position="north" size="130" style="background-color:#E8E8E8">
				<div style="font-size:40px; background-color:#E8E8E8">Play Games</div>
		<div style="background-color:#E8E8E8">Sistema Gerenciador</div>
			<h:form id="form_3">
				<p:menubar>
					<p:submenu label="Relatórios">
						<p:menuitem value="Perfil Cliente"
							onclick="relatorioCliente()" />
						<p:menuitem value="Perfil Clientela"
							onclick="relatorioClientela()" />
					</p:submenu>
				</p:menubar>
			</h:form>
		</p:layoutUnit>

		<p:layoutUnit position="center" header="Usuários">
			<h:panelGroup id="panelGroupUsuario" layout="block">
				<!-- Listar Usuario -->
				<p:panel id="painelListarUsuario" widgetVar="painelListarUsuario"
					visible="true" closable="true" closeSpeed="0" style="border: none">
					<h:form id="formListarUsuario">
						<p:dataTable style="width: 50%;" value="#{usuarioBean.usuarios}"
							var="usu" emptyMessage="" id="tableUsu" paginator="true" rows="7"
							paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
							rowsPerPageTemplate="7,14,21">

							<p:column>
								<f:facet name="header">
									<h:outputText value="Nome" />
								</f:facet>
								<h:outputText value="#{usu.nome}" />
							</p:column>
							<p:column>
								<p:commandButton value="Consultar Histórico"
									update=":formConsultarUsuario" action="#{usuarioBean.gerarHistorico}"
									oncomplete="PF('painelConsultarUsuario').show(); PF('painelListarUsuario').close();">
									<f:setPropertyActionListener target="#{usuarioBean.usuario}"
										value="#{usu}"></f:setPropertyActionListener>
								</p:commandButton>
							</p:column>
						</p:dataTable>
					</h:form>
				</p:panel>

				
				<!-- Consultar Usuario -->
				<p:panel id="painelConsultarUsuario"
					widgetVar="painelConsultarUsuario" visible="false" closable="true"
					closeSpeed="0" style="border: none">
					<h:form id="formConsultarUsuario">
						<p:panel style="width: 50%;">
							<p:dataTable style="width: 100%;" value="#{usuarioBean.listaHistorico}"
							var="hist" emptyMessage="" id="tableUsu" paginator="true" rows="7"
							paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
							rowsPerPageTemplate="7,14,21">

							<p:column>
								<f:facet name="header">
									<h:outputText value="Evento" />
								</f:facet>
								<h:outputText value="#{hist.evento}" />
							</p:column>
							<p:column>
								<f:facet name="header">
									<h:outputText value="Data" />
								</f:facet>
								<h:outputText value="#{hist.data.time}">
									<f:convertDateTime type="both" pattern="dd/MM/yyyy" />
								</h:outputText>
							</p:column>
							<p:column>
								<f:facet name="header">
									<h:outputText value="Hora" />
								</f:facet>
								<h:outputText value="#{hist.data.time}">
									<f:convertDateTime type="both" pattern="HH:mm:SS" />
								</h:outputText>
							</p:column>
						</p:dataTable>

						</p:panel>
						<div class="posicao_botao" align="right">
							<p:commandButton value="Voltar"
								onclick="PF('painelConsultarUsuario').close(); PF('painelListarUsuario').show();"
								type="button" />
						</div>
					</h:form>

				</p:panel>
			</h:panelGroup>
		</p:layoutUnit>

	</p:layout>

</body>
</html>